<!-- 红包商城 商品分类管理 -->
<template>
  <div class="table">
    <SearchTable v-model:formStatus="formStatus" ref="searchTableRef" @handleViewEdit="handleViewEdit" />
    <FormDialog v-model:formStatus="formStatus" v-model:form="categoriesForm" @handleSuccess="handleSuccess" />
  </div>
</template>

<script setup lang="ts" name="categoriesInfo">
import SearchTable from "@/components/redPacketMallManage/categoriesInfo/SearchTable.vue";
import FormDialog from "@/components/redPacketMallManage/categoriesInfo/FormDialog.vue";
import type { ViewMode, ViewModeFilter } from "@/types/common";
import type { IMallCategory } from "@/types/mallCategory";
/* 表格子组件的引用 */
const searchTableRef = useTemplateRef("searchTableRef");
const formStatus = ref<ViewMode>("none");
const categoriesForm = reactive<IMallCategory>({
  id: 0,
  sort: 0,
  name: "",
  status: 0,
  is_vajra: 0,
  image: ""
});
/* 点击编辑按钮 */
function handleViewEdit(row: IMallCategory, code: ViewModeFilter) {
  formStatus.value = code;
  nextTick(() => {
    categoriesForm.id = row.id;
    categoriesForm.name = row.name;
    categoriesForm.sort = row.sort;
    categoriesForm.status = row.status;
    categoriesForm.is_vajra = row.is_vajra;
    categoriesForm.image = row.image;
  });
}
/* 成功保存或者编辑的回调 */
function handleSuccess() {
  searchTableRef.value?.getTableInfo();
}
</script>

<style lang="scss" scoped></style>
